<?php if (!defined('THINK_PATH')) exit();?><!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>Test</title>
    <link rel="stylesheet" type="text/css" href="/taobao_3dchat/Public/Web/css/style.css">
    <link rel="stylesheet" type="text/css" href="/taobao_3dchat/Public/Web/css/main.css">
    <link rel="stylesheet" type="text/css" href="/taobao_3dchat/Public/Web/css/maina1.css">
    <link rel="stylesheet" type="text/css" href="/taobao_3dchat/Public/Web/css/login.css">
    <link rel="stylesheet" type="text/css" href="/taobao_3dchat/Public/Web/css/animate.css">
    <link rel="stylesheet" type="text/css" href="/taobao_3dchat/Public/Web/css/my.css">
    <link rel="stylesheet" type="text/css" href="/taobao_3dchat/Public/Web/css/im.css">
    <!--Bootstrap 引入--------->
    <!--<script src="https://cdn.bootcss.com/jquery/1.12.4/jquery.min.js"></script>-->
    <script type="text/javascript" src="/taobao_3dchat/Public/Web/js/jquery.min.js"></script>
    <!-- 最新版本的 Bootstrap 核心 CSS 文件 -->
    <link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css"
          integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">


    <!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
    <script src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js"
            integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa"
            crossorigin="anonymous"></script>


    <!--Bootstrap 引入 end -------------------------->
    <!-- 配置文件 -->
    <script type="text/javascript" src="/taobao_3dchat/Public/Web/Ueditor/ueditor.config.js"></script>
    <!-- 编辑器源码文件 -->
    <script type="text/javascript" src="/taobao_3dchat/Public/Web/Ueditor/ueditor.all.js"></script>
    <script type="text/javascript" charset="utf-8" src="/taobao_3dchat/Public/Web/Ueditor/lang/zh-cn/zh-cn.js"></script>

    <script type="text/javascript">
        function getlistid(id,ele,title) {
                    $(".onchoose").removeClass("onchoose").addClass("left_sort_span");
                    $(ele).removeClass("left_sort_span").addClass("onchoose");
            $("#right_main_page").load("/taobao_3dchat/Public/test.html", function () {
            });

            $("#left_list").load("/taobao_3dchat/index.php/index/getitemlist/type/" + id, function () {
//                $("#sort_name").text("["+title+"]");
            });

        }

    </script>

    <script type="text/javascript">
        function loadfinish() {
          $("#list_left_sort").first().click();
        }

    </script>
    <script type="text/javascript" src="/taobao_3dchat/Public/Admin/js/Validform_v5.3.2_min.js"></script>


    <script type="text/javascript">
        $(".postlogin").Validform();
    </script>

</head>

<body bgcolor="#dfdfdf"  onload="loadfinish()">


<div id="loginModal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">x</button>
                <h1 class="text-center text-primary" style="color: #000;">3DCHAT會員</h1>
            </div>
            <div class="modal-body" style="width: 100%;display: inline-block;">
                <form action="/taobao_3dchat/index.php/Index/checking" method="post" class="form col-md-12 center-block postlogin" >
                    <div class="form-group">
                        <input type="email" class="form-control input-lg" placeholder="電子郵件" name="username" id="loginaccout" datatype="e"  nullmsg="郵箱不能為空">
                    </div>
                    <div class="form-group">
                        <input type="password" class="form-control input-lg" placeholder="登陸密碼" name="password" datatype="*6-12" nullmsg="密碼不能為空">
                    </div>
                    <div class="form-group">
                        <button class="btn btn-primary btn-lg btn-block">登録</button>
                    </div>
                    <div class="form-group" style="margin-top: 8px">
                        <span><a href="#" style="color: #000">忘記密碼？</a></span>
                        <span><a href="/taobao_3dchat/index.php/register/" class="pull-right" style="color: #000">註冊</a></span>
                    </div>
                </form>
            </div>
            <div class="modal-footer">

            </div>
        </div>
    </div>
</div>

<script type="text/javascript">
    function rename() {
        var name = $("#rename_content").val();
        if (name.length > 0) {
            $.post("/taobao_3dchat/index.php/Index/changnickname", {'name': name}, function (data) {
                switch (data.status) {
                    case 1:
                        alert("改名成功");
                        var a = document.getElementById("myname");
                        a.innerHTML = data.nickname;
                        name.val("");
                        break
                    case 2:
                        alert("尚未登录");
                        break
                }
            }, "json")
        }
        else
        {
            alert("新昵称不能为空");
        }
    }

</script>

<script type="text/javascript">
    function notifypwd() {
        var oldpwd= $("#oldpwd").val();
        var newpwd= $("#newpwd").val();
        if (oldpwd.length>0 && newpwd.length>0)
        {
        $.post("/taobao_3dchat/index.php/Index/changpwd",{'oldpwd':oldpwd,'newpwd':newpwd},function (data) {
            switch (data.status) {
                case 1:
                    alert("密码修改成功!");
                    $("input").val("");
                    oldpwd.val("");
                    newpwd.val("");
                    break
                case 0:
                    alert("旧密码错误,修改失败");
                   oldpwd.val("");
                    newpwd.val("");
                    break
                case 2:
                    alert("登陆超时");
                    break
            }
        },"json")
        }
        else
        {
            alert("密码不能为空");
        }
    }

</script>


<div id="renamemodal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">x</button>
                <h1 class="text-center text-primary" style="color: #000; font-size: 24px">修改暱稱</h1>
            </div>
            <div class="modal-body">
                    <div class="form-group">
                        <input type="text" class="form-control input-lg" placeholder="請輸入新暱稱" id="rename_content">
                    </div>
                    <div class="form-group">
                        <button class="btn btn-primary btn-lg btn-block" onclick="rename()" data-dismiss="modal" aria-label="Close">確認修改</button>
                    </div>
            </div>
            <div class="modal-footer">

            </div>
        </div>
    </div>
</div>
<div id="repwdmodal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">x</button>
                <h1 class="text-center text-primary" style="color: #000; font-size: 24px">修改密码</h1>
            </div>
            <div class="modal-body">
                <div class="form-group">
                    <input type="password" class="form-control input-lg" placeholder="请输入旧密码" id="oldpwd">
                    <input type="password" class="form-control input-lg" placeholder="请输入新密码" id="newpwd"  style="margin-top: 10px">
                </div>
                <div class="form-group">
                    <button class="btn btn-primary btn-lg btn-block" onclick="notifypwd()" data-dismiss="modal" aria-label="Close">確認修改</button>
                </div>
            </div>
            <div class="modal-footer">

            </div>
        </div>
    </div>
</div>
<div class="main" style="display: inline">
    <!-- page left -->
    <div class="fl fl_m w30">
        <!-- page left header -->
        <div class="main-header">
            <a href="javascript:;" class="fl showMenu btnset" id="showMenu">

                <img src="/taobao_3dchat/Public/Web/img/setting.png" class="setting" align="center">
            </a>
            <span class="title fl">3DCHAT</span>

        </div>

        <!-- page left con -->
        <div class="scrollbar_1 main-con box_line" id="left_list">
            <div style="width: auto;height: 900px;background-color: #fff;">


            </div>
        </div>

    </div>


    <!-- page right -->

    <div class="fr fr_m" style=" overflow:auto;">
        <!-- page right header -->
        <div class="main-header">
            <span class="title fl" style="display:inline;font-weight: bold;font-size: 34px" id="title_artcle"> </span>


            <a  class=" replaya" id="showMenu4" style="float: right" onclick="replayartcle()" >
                <span class="replay_tie">回復</span>
            </a>

            <a href="javascript:;" class="fr" id="showMenu3" onclick="setbad()" >
                <img src="/taobao_3dchat/Public/Web/img/chaping.png" style="width: 20px;height: 20px;" align="center">
            </a>
            <a href="javascript:;" class="fr" id="showMenu2" onclick="setzan()">
                <img src="/taobao_3dchat/Public/Web/img/zan.png" style="width: 20px;height: 20px;" align="center">
            </a>
            <?php if(empty($_SESSION['USER'])): ?><a href="javascript:;" class=" replaya" style="float: right" data-toggle="modal"
                   data-target="#loginModal" >
                    <span class="replay_tie" id="newtie2">新帖</span>
                </a>
                <?php else: ?>
                <a href="javascript:;" class=" replaya" id="showMenu5" style="float: right"  onclick="pushnewtie()" >
                    <span class="replay_tie" id="newtie1">新帖</span>
                </a><?php endif; ?>
            <a style="float: right" class="unSeeNum" href="javascript:;">
                <span class="cont">未读(0)</span>
            </a>

            <!--</empty>-->




        </div>
        <div style="width: 100%; height: 900px;">
            <div style="top: 0px;bottom:0px;width: 100%;height: 100%;" id="top_layout">
                <div style="border: 2px solid slateblue;background-color: #f0f0f0;height:100%;width: 100%;overflow-y: scroll;"
                     id="right_main_page">


                </div>
                <div id="bottom_page">


                </div>
            </div>

        </div>

        <div class="scrollbar_1 main-con">
        </div>


    </div>

</div>
<div class="IM-disk" style="width: 70%; height: 500px;overflow: hidden;border:1px solid #e3e3e3;margin:50px auto;position: fixed;top: 0px;left: 15%;display: none;">
</div>
<!-- page disk -->
<div class="disk menu_disk">
    <div class="menu-disk-con fl">
        <div class="header">
            <a href="#" class="click1 setinline">
                <img src="/taobao_3dchat/Public/Web/img/xiao.png" class="img_head setinline">
                <span class="head_font setinline w100" >3DCHAT</span></a>
            <!--- 通過Session判斷是否有用戶 -->
            <?php if(empty($_SESSION['USER'])): ?><a href="#" class="click1 setinline" id="loginA" data-toggle="modal" data-target="#loginModal" >
                    <img src="/taobao_3dchat/Public/Web/img/user.png" class="img_head setinline">
                    <span class="head_font setinline w100">登入 ／ 註冊</span></a>
                <?php else: ?>
                <a href="#" class="click1 setinline"  data-toggle="modal" data-target="#renamemodal" >
                    <img src="/taobao_3dchat/Public/Web/img/user.png" class="img_head setinline">
                    <span class="head_font w100" id="myname"> <?php echo ($_SESSION['USER']['nickname']); ?></span></a>
                <a href="#" class="click1 setinline"  data-toggle="modal" data-target="#repwdmodal" >
                    <img src="/taobao_3dchat/Public/Web/img/pwd.png" class="img_head setinline">
                    <span class="head_font w100" id="notifypwd"> 修改密码</span></a>
                <a href="/taobao_3dchat/index.php/Index/logout" class="click1"  >
                    <img src="/taobao_3dchat/Public/Web/img/login_out.png" class="img_head setinline">
                    <span class="head_font setinline w100">登出</span></a><?php endif; ?>
            <!--- 通過Session判斷是否有用戶-END -->

        </div>
        <div class="left_sort_list" id="left_sortlist" >
            <?php if(is_array($typelist)): $i = 0; $__LIST__ = $typelist;if( count($__LIST__)==0 ) : echo "" ;else: foreach($__LIST__ as $key=>$typelist): $mod = ($i % 2 );++$i;?><a href="javascript:;" class="left_sort_item"  >
            <span class="left_sort_span fff" id="list_left_sort" onclick="getlistid('<?php echo ($typelist["id"]); ?>',this,'<?php echo ($typelist["name"]); ?>')"  >
                <?php echo ($typelist["name"]); ?>
            </span>
                </a><?php endforeach; endif; else: echo "" ;endif; ?>
        </div>

    </div>


    <!--<div class="scrollbar_2 con">-->
    <!--<div style="width: auto ;height: 900px;background-color: #c9c9c9;"></div>-->

    <!--</div>-->


</div>

</div>


</body>

<script type="text/javascript" src="/taobao_3dchat/Public/Web/js/main.js"></script>
<script type="text/javascript" src="/taobao_3dchat/Public/Web/js/new.js"></script>

<script type="text/javascript">
    $(document).on("click", ".left_sort_span", function () {
//        alert("------"+id);
//        $(".onchoose").removeClass("onchoose").addClass("left_sort_span");
//        $(this).removeClass("left_sort_span").addClass("onchoose");
//        $("#right_main_page").load("/taobao_3dchat/Public/test.html",function () {
//            alert("Loading rightmain");
//        });
//        $("#left_list").load("/taobao_3dchat/index.php/index/getitemlist/type/<?php echo ($typelist["id"]); ?>",function () {
//            alert("Loading leftartclelist");
//        });
    });

</script>
<script type="text/javascript">
    // $(document).on("click",".list_item",function () {
    //   $("#right_main_page").load("/taobao_3dchat/Public/main_page_container.html",function () {
    //            alert("loading mianpage");
    //   });
    //  });
</script>
<script type="text/javascript">
    var ImIndexUrl = "<?php echo U('Message/ImIndex');?>";

    var ajaxSelectFun;
    var ajaxUnReadMessageCount;

    var loginUserId = "<?php echo ($_SESSION['USER']['id']); ?>";

    function setImLeftHtml(id,nickName,$unReadcount){
        var html  = '<div class="person imToPerson" data-id="'+id+'">';
            html += '<span>'+nickName+'</span>';
            if($unReadcount>0){
                html +='<i>'+$unReadcount+'</i>';
            }
            html += '</div>';
        return html;
    }
    function setImPersionList(defPersion){
        var imPersionHtml = '';
        if(defPersion!=null&&loginUserId!=defPersion.id){
            if(defPersion.id!=null&&defPersion.id!=''&&defPersion.nickname!=null&&defPersion.nickname!='')
            imPersionHtml += setImLeftHtml(defPersion.id,defPersion.nickname);
        }
        $.post("<?php echo U('Message/getMessageList');?>",{},function(result){
            if(result!=null){
                var dataList = eval(result);
                for (var i = dataList.length - 1; i >= 0; i--) {
                    if((defPersion!=null&&dataList[i]['tid']!=defPersion.id)||defPersion==null){
                        imPersionHtml += setImLeftHtml(dataList[i]['tid'],dataList[i]['nickname'],dataList[i]['count']);
                    }
                }
            }
            $(document).find(".personList").html(imPersionHtml);
            $(document).find(".imToPerson").eq(0).trigger("click");
            window.clearTimeout(ajaxSelectFun);
            ajaxSelectFun = window.setTimeout(function(){ajaxSelectMsg();},500);
        });
    }

    $(document).on("click",".chat-person,.unSeeNum",function(e){
        console.log("is run loginUserId:"+loginUserId);
        e.stopPropagation();
        if(loginUserId!=null&&loginUserId!=''){
        	var defPersion={id:0,nickname:''};
	        if($(this).attr('data-id')!=null){defPersion.id = $(this).attr('data-id');}
            console.log("defPersion.id:"+defPersion.id);
	        if(loginUserId!=defPersion.id){
                console.log("is run");
	        	if($(this).html()!=null){defPersion.nickname = $(this).html();}
		        $(".IM-disk").load(ImIndexUrl,function(){
		            setImPersionList(defPersion);
		            $(".IM-disk").show();
		        });
	        }else{
	        	console.log("不能跟自己聊天！或许你可以尝试买个镜子");
	        }
        }else{
        	$('#loginA').trigger('click');
        }
    });

    $(document).on("click",".imToPerson",function(e){
        e.stopPropagation();
        $(document).find("#messageCon").html();
        var defPersion={id:0,nickname:''};
        if($(this).attr('data-id')!=null){defPersion.id = $(this).attr('data-id');}
        if($(this).children("span").html()!=null){defPersion.nickname = $(this).children("span").html();}
        $(".IM").find(".imPersonInfo").children(".title").find("b").html(defPersion.nickname);
        $(".IM").find(".imPersonInfo").attr("data-id",defPersion.id);

        $(".personList").prepend(setImLeftHtml(defPersion.id,defPersion.nickname));
        $(this).remove();

        var messageConHtml='';
        $.post("<?php echo U('Message/getAllMessage');?>",{id:defPersion.id},function(result){
            var messageList = eval(result);
            for (var i = 0; i < messageList.length; i++) {
                if(defPersion.id==messageList[i]['fid']){
                    messageConHtml += '<div><p class="tx_n">';
                }else{
                    messageConHtml += '<div><p class="tx_r">';
                }
                messageConHtml += messageList[i]['message']+'</p></div>';
            }
            $(document).find("#messageCon").html(messageConHtml);
            document.getElementById('messageCon').scrollTop = document.getElementById('messageCon').scrollHeight;
        });
    });

    function sendMessage(data){
        $.post("<?php echo U('Message/sendMessage');?>",data,function(result){
            if(result.status==1){
                var messageConHtml = '<div><p class="tx_r">'+data.msg+'</p></div>';
                $(document).find("#messageCon").append(messageConHtml);
                $(document).find("#message_content").val(null);
                document.getElementById('messageCon').scrollTop = document.getElementById('messageCon').scrollHeight;
            }else{
                alert("发送失败！");
            }
        });
    }

    $(document).on("click","#sendMessage",function(e){
        e.stopPropagation();
        var message_content = $(document).find("#message_content").val();
        if(message_content!=null){
            var data = {id:0,msg:''};
            data.id = $(".IM").find(".imPersonInfo").attr("data-id");
            data.msg = message_content;
            if(data.id!=null){
                sendMessage(data);
            }else{
                alert("参数错误！");
            }
        }
    });
    $(document).keypress(function(e) {
        if(e.ctrlKey && e.which == 13 || e.which == 10) {
            console.log("is run");
            $(document).find("#sendMessage").trigger("click");
        }
    });
    function getUnReadMessageCount(){
        if(loginUserId!=""&&loginUserId!=null){
            $.post({
                url:"<?php echo U('Message/getUnReadMessageCount');?>",
                async: false,
                success:function(result){
                    $(".unSeeNum").find(".cont").html("未读("+result+")");
                }
            });
        }
        window.clearTimeout(ajaxUnReadMessageCount);
        ajaxUnReadMessageCount = window.setTimeout(function(){getUnReadMessageCount();},10000);
    }

    function ajaxSelectMsg(){
        
        $(document).find(".imToPerson").each(function(ind,e){
            var index = ind;
            var tid = $(this).attr("data-id");
            if(tid!=null){
                var changeType = 0;
                if(index==0){
                    changeType = 1;
                }
                $.post({
                    url:"<?php echo U('Message/getUnReadMessage');?>",
                    data:{id:tid,changeType:changeType},
                    async: false,
                    success:function(result){
                        console.log(index);
                        console.log(result);
                        console.log(" ");
                        console.log(" ");
                        console.log(" ");
                        if(index==0){
                            var messageConHtml='';
                            var messageList = eval(result.data);
                            console.log(messageList);
                            for (var i = 0; i < messageList.length; i++) {
                                if(tid==messageList[i]['fid']){
                                    messageConHtml += '<div><p class="tx_n">';
                                }else{
                                    messageConHtml += '<div><p class="tx_r">';
                                }
                                messageConHtml += messageList[i]['message']+'</p></div>';
                            }
                            $(document).find("#messageCon").append(messageConHtml);
                            document.getElementById('messageCon').scrollTop = document.getElementById('messageCon').scrollHeight;
                        }else if($(this).find("i").length>0){
                            $(this).find("i").html(result.count);
                        }else{
                            var appendHtml = "<i>"+result.count+"</i>";
                            $(this).html($(this)+appendHtml);
                        }
                        window.clearTimeout(ajaxSelectFun);
                        ajaxSelectFun = window.setTimeout(function(){ajaxSelectMsg();},10000);
                    }
                });
            }
        })
    }

    $(document).on("click",".settings",function(){
        $(".IM-disk").hide();
        $(".IM-disk").html('');
        window.clearTimeout(ajaxSelectFun);
    });
    $(document).ready(function(){
        ajaxUnReadMessageCount = window.setTimeout(function(){getUnReadMessageCount();},10000);
    });
</script>
</html>